
<template>
  <div class="execution">
    <basic-container>
      <avue-crud
        ref="crud"
        :page="page"
        :data="tableData"
        :permission="permissionList"
        :table-loading="tableLoading"
        :option="tableOption"
        @search-change="searchChange"
        @refresh-change="refreshChange"
      >
        <template slot="menuRight">
          <el-button
            @click="exportClick"
            v-if="permissionList.reportExport"
          >导出</el-button>
          <el-button
            @click="$emit('exit')"
          >返回</el-button>
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import { fetchList, dataExport } from '@/api/rca/swckdiffafterclearreport'
import { handleExcelResponse, getQueryString, handleDownFile, deepClone } from '@/util/util';
import { tableOption } from '@/const/crud/rca/swckdiffafterclearreport'
import { mapGetters } from 'vuex'

export default {
  name: 'report',
  data () {
    return {
      searchForm: {},
      tableData: [],
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20 // 每页显示多少条
      },
      tableLoading: false,
      tableOption: tableOption
    }
  },
  computed: {
    ...mapGetters(['permissions']),
    permissionList () {
      return {
        reportExport: this.vaildData(this.permissions.sw_ck_diff_after_clear_report_export, false)
      };
    }
  },
  methods: {
    async exportClick () {
      this.dataExport();
    },
    async dataExport () {
      if (!this.searchForm.statisticsMonth) {
        this.$message.error('统计月份不能为空');
        return;
      }
      let loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      })
      try {
        const res = await dataExport(Object.assign({}, this.searchForm));
        handleExcelResponse(res);
      } finally {
        loading.close();
      }
    },
    getList (page, params) {
      this.tableLoading = true
      const { tradeDate } = this.searchForm
      const [startDate, endDate] = tradeDate || []
      fetchList(Object.assign({
        current: page.currentPage,
        size: page.pageSize
      }, params, this.searchForm, {
        startDate,
        endDate,
      })).then(response => {
        this.tableData = response.data.data
        //this.page.total = response.data.data.total
        this.tableLoading = false
      }).catch(() => {
        this.tableLoading = false
      })
    },
    async searchChange (form, done) {
      this.searchForm = { ...form };
      if (!this.searchForm.statisticsMonth) {
        this.$message.error('统计月份不能为空');
        return;
      }
      try {
        await this.getList(this.page, this.searchForm);
      } finally {
        done();
      }
    },
    refreshChange () {
      this.getList(this.page)
    }
  }
}
</script>
